<template>
  <div class="commenthouse-content">
    <nav-bar title="评论房源">
      <div slot="left" @click="toBack" class="left">
        <van-icon name="arrow-left" />
      </div>
      <div slot="center" class="center">房源评论</div>
      <!-- <div slot="right" @click="toPublishComment">发表</div> -->
    </nav-bar>
    <house-item :houseItem="houseItem" :imgPath="imgPath" @todetail="todetail" />
    <house-comment @toPublishComment="toPublishComment" />
  </div>
</template>

<script>
import NavBar from "components/common/navbar/NavBar";
import HouseItem from "components/common/houseitem/HouseItem";

import { appointmentHouse } from "network/appointmentHouse"; //查看房子信息
import { getHouseComment } from "network/housedetail";

import HouseComment from "./housecomment/HouseComment";

export default {
  name: "commenthouses",
  components: {
    NavBar,
    HouseItem,
    HouseComment,
  },
  data() {
    return {
      houseItem: {},
      imgPath: "",
      staticpath: localStorage.getItem("staticpath"),
    };
  },
  methods: {
    toBack() {
      this.$router.back();
    },
    toPublishComment() {},
    todetail() {
      this.$router.push("/housedetail?houseId=" + this.$route.query.houseId);
    },
  },
  created() {
    let houseId = this.$route.query.houseId;
    appointmentHouse({ houseId }).then((res) => {
      console.log(res);
      this.houseItem = res.data;
      this.imgPath = this.staticpath + res.data.images[0].path;
    });
    getHouseComment({ houseId }).then((res) => {
      console.log(res);
    });
  },
};
</script>

<style scoped>
.commenthouse-content {
  padding-top: 50px;
}
.center {
  color: #fff;
  font-size: 16px;
}
.left,
.right {
  font-size: 23px;
  display: flex;
  justify-content: center;
  align-items: center;
}
</style>